<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<script src="js/mui.js"></script>
		<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js"></script>
		<script src="./utils/myRequest.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function () {
			    //获取上个页面传过来的值
				var username = plus.webview.currentWebview().username;
				// plus.nativeUI.toast(username);
				
				var user = store.getItem();
				
				var param = new Object();
				param.username = username;
				
				request.ajax({
					url : "/websocket/user/getUserByUsername",
					data : param,
					type : "post",
					success : function(resp){
						if(resp.code == 20000){
							//获取ul对象
							var ul = document.getElementById("ul");
							var arrays = resp.data.list;
							
							
							for (var i = 0; i < arrays.length; i++) {
								var html = "";
								if(user.minHeand != null){
									html += "<li id=\""+arrays[i].username+"\" class=\"mui-table-view-cell mui-media\">\n" +
											"<a href=\"javascript:;\">\n" +
											"<img class=\"mui-media-object mui-pull-left\" src=\""+arrays[i].minHeand+"\"/>\n" +
											"<div class=\"mui-media-body\">\n" +
											"<p class=\"mui-ellipsis\">"+arrays[i].username+"</p>\n" +
											"<p class=\"mui-ellipsis\">"+arrays[i].nickname+"</p>\n" +
											"</div>\n" +
											"</a>\n" +
											"</li>";
								}else{
									html += "<li id=\""+arrays[i].username+"\" class=\"mui-table-view-cell mui-media\">\n" +
											"<a href=\"javascript:;\">\n" +
											"<img class=\"mui-media-object mui-pull-left\" src=\"./img/tou.jpg\"/>\n" +
											"<div class=\"mui-media-body\">\n" +
											"<p class=\"mui-ellipsis\">"+arrays[i].username+"</p>\n" +
											"<p class=\"mui-ellipsis\">"+arrays[i].nickname+"</p>\n" +
											"</div>\n" +
											"</a>\n" +
											"</li>";
								}
								
								$("#ul").append(html);
								
							}
						}
					}
					
				});
				
				mui(".mui-table-view").on('tap','.mui-table-view-cell',function(){
					  //获取id
					 var name = this.getAttribute("id");
					 mui.openWindow({
					     url:'friendAuth.html',
					     id:'friendAuth.html',
					     extras:{
					       name : name  //自定义扩展参数，可以用来处理页面间传值
					     }
					 });
					 
				}) 
			});
			
			
			//跳转到添加好友申请的页面
			// document.getElementById("addFriendBtn").addEventListener("tap",function(){
			// 	mui.openWindow({
			// 	    url:'friendAuth.html',
			// 	    id:'friendAuth.html',
			// 	    extras:{
			// 	      username : username  //自定义扩展参数，可以用来处理页面间传值
			// 	    }
			// 	});
			// })
		</script>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">好友展示</h1>
		</header>
		
		<!-- <div > -->
			<ul class="mui-table-view" id="ul" style="margin-top: 50px;">
				<!-- <li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="img/tou.jpg">
						<div class="mui-media-body">
							<p class="mui-ellipsis">486566947</p>
							<p class="mui-ellipsis">未进化的程序猿</p>
						</div>
					</a>
				</li> -->
			</ul>
			
			<!-- <ul class="mui-table-view" style="margin-top: 20px;text-align: center;color: white;background-color: #2AC845;">
				<li class="mui-table-view-cell mui-media" id="addFriendBtn">
					<a href="javascript:;">
						添加好友
					</a>
				</li>
			</ul> -->
		<!-- </div> -->
		
	</body>

</html>
